<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>日期选择插件</title>
<link href="css/jquery.ui.datepicker.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery-1.8.3.js"></script>
<script type="text/javascript" src="js/jquery.ui.core.js"></script>
<script type="text/javascript" src="js/jquery.ui.datepicker.js"></script>
<script type="text/javascript">
$(function(){

	$( "#from" ).datepicker({
		defaultDate: "",
		changeMonth: true,
		numberOfMonths: 1,
		onClose: function( selectedDate ) {
			$( "#to" ).datepicker( "option", "minDate", selectedDate );
		}
	});
	
	$( "#to" ).datepicker({
		defaultDate: "",
		changeMonth: true,
		numberOfMonths: 1,
		onClose: function( selectedDate ) {
			$( "#from" ).datepicker( "option", "maxDate", selectedDate );
		}
	});
	
	$( "#datepicker , #datepicker1" ).datepicker({
		changeMonth: true,
		changeYear: true
	});//日期修改年份
	
});
</script>
</head>
<body>
	<h3>这是个时间插件--5.20</h3>
<table width="600" border="0" cellspacing="0" cellpadding="0" class="register-table">
  <tr>
    <td height="40" align="right">有效期起始:</td>
    <td height="40" align="left"><input type="text" name="te" id="from" class="test-style width150" /></td>
    <td height="40" align="right">有效期截止:</td>
    <td height="40" align="left"><input type="text" name="tex" id="to" class="test-style width150" /></td>
  </tr>
  
</table>

</body>
</html>
